/*
 * @Author: yangzonglong
 * @Date: 2021-07-08 14:12:22
 * @version: v1.0.0
 * @Descripttion: Table Radio 控制器
 * @LastEditors: Please set LastEditors
 * @LastEditTime: 2021-08-27 14:08:13
 * @Auditor:
 */
import React, { useCallback } from 'react';
import update from 'immutability-helper';
import { Form, Select, Checkbox } from 'antd';
import CommonController from '../CommonController';
import { IProps } from '../config';
import moment from 'moment';

const FormItem = Form.Item;
const Option = Select.Option;

const modeData = [
  { value: 'YYYY/MM', label: '年/月' },
  { value: 'YYYY/MM/DD', label: '年/月/日' },
  { value: 'YYYY/MM/DD HH:mm:ss', label: '年/月/日 时:分:秒' },
];

const modeMap = {
  'YYYY/MM': 'month',
  'YYYY/MM/DD': 'date',
  'YYYY/MM/DD HH:mm:ss': 'date',
};

const CheckBoxController = ({
  tableProps,
  dataSource,
  print,
  initialValues,
  isInitialValue,
  required,
  originalIndex,
  format,
  textAlign,
  columns,
  dataIndex,
  title,
  titleEn,
  width,
  disabled,
  exportFlag,
  changeColumnOptions,
  changeControlProps,
  setCurColumn,
  fontSize,
  fontWeight,
  backgroundColor,
  color,
  customizeStyleFlag
}: IProps) => {
  const onChangeColumnOptions = useCallback(
    (e: any, k: string, isChecked?: boolean) => {
      changeColumnOptions(k, isChecked ? e.target.checked : e.target.value, originalIndex);
    },
    [changeColumnOptions, originalIndex]
  );

  const _changeControlProps = useCallback(
    (e: any, k: string, isChecked?: boolean) => {

      changeControlProps(
        'tableProps',
        {
          ...tableProps,
          columns: update(columns!, {
            [originalIndex!]: {
              [k]: {
                $set: isChecked ? e.target.checked : e?.target?.value || (typeof e === 'object' ? '' : e),
              },
            },
          }),
          dataSource: { $set: dataSource },
        },
        true
      );
      setCurColumn?.({ ...columns![originalIndex!], originalIndex, [k]: isChecked ? e.target.checked : e?.target?.value || (typeof e === 'object' ? '' : e) });
    },
    [changeControlProps, tableProps, columns, originalIndex, dataSource, setCurColumn]
  );

  return (
    <CommonController
      showTextAlign
      onChangeControlProps={_changeControlProps}
      onChangeColumnOptions={onChangeColumnOptions}
      {...{ title, titleEn, dataIndex, width, required, print, disabled, exportFlag, fontSize, fontWeight, backgroundColor, color, textAlign, customizeStyleFlag }}
    >

      <FormItem label="显示格式">
        <Select onChange={(e) => changeColumnOptions('format', e, originalIndex)} value={format}>
          {modeData.map((item) => (
            <Option value={item.value} key={item.value}>
              {item.label}
            </Option>
          ))}
        </Select>
      </FormItem>

      <FormItem className='antd-form-item-row' label="默认当前日期">

        <Checkbox
          onChange={(e) => changeColumnOptions('isInitialValue', e.target.checked)}
          checked={isInitialValue} />
        {/* <DatePicker style={{ width: '100%' }} picker={modeMap[format as string]} format={format} value={initialValues ? moment(initialValues) : null} onChange={(e) => changeColumnOptions('initialValues', e ? moment(e).format(format as string) : null)} /> */}
      </FormItem>

    </CommonController>
  );
};

export default CheckBoxController;
